import { Breadcrumb } from 'antd';
import Types from './types';
import Search from './Search';

import styles from './index.less';
import {useState} from "react";
import {useParams} from "umi";
import {useUpdateEffect} from "ahooks";

const KnowledgeSearch = () => {
    const {
        id,
    }: {
        id:string;//路由上的知识ID
    } = useParams();
    // @ts-ignore
    const [ nodeKeys,setNodeKeys ] = useState<any[]>(id?[id]:undefined);
    useUpdateEffect(()=>{
        setNodeKeys(nodeKeys);
    },[nodeKeys])

    return (
        <div className={styles.wrapper}>
            <div className={styles.left}>
                <Types bodyStyle={{ minHeight: 400 }} setNodeKeys={setNodeKeys} nodeKeys={nodeKeys}/>
            </div>
            <div className={styles.right}>
                <div className={styles.breadcrumb}>
                    <Breadcrumb>
                        <Breadcrumb.Item>
                            <a href="/">首页</a>
                        </Breadcrumb.Item>
                        <Breadcrumb.Item>
                            <a href="/knowledge">知识库</a>
                        </Breadcrumb.Item>
                        <Breadcrumb.Item>列表</Breadcrumb.Item>
                    </Breadcrumb>
                </div>
                <div className={styles.content}>
                    <Search setNodeKeys={setNodeKeys}  nodeKeys={nodeKeys}/>
                </div>
            </div>
        </div>
    );
};

export default KnowledgeSearch;
